import {
  UploadOutlined,
  UserOutlined,
  VideoCameraOutlined,
  DesktopOutlined
} from '@ant-design/icons';
import { Layout, Menu } from 'antd';
import React from 'react';
import LeftStyle from './left.module.css'
import { Link } from 'react-router-dom';
const { Sider } = Layout;


export default function HomeLeft (props)  {
  return (
      <Sider trigger={null} collapsible collapsed={props.collapsed} className="h100">
        <div className={`align-center ${LeftStyle.avatar}`}>
          <img src={require('./../../assets/1.webp')} width={props.collapsed ? 45 : 80} alt=''/>
          {!props.collapsed && <p>Admin</p>}
        </div>
        <Menu
          theme="dark"
          mode="inline"
          defaultSelectedKeys={['1']}
        >
           <Menu.Item key={1} icon={<DesktopOutlined />}>
            <Link to={'/index'}> 首页</Link>
           
          </Menu.Item>
          <Menu.Item key={2} icon={<UserOutlined></UserOutlined>}>
            <Link to={'/user'}> 用户管理</Link>
            
          </Menu.Item>
          <Menu.Item key={3} icon={<VideoCameraOutlined></VideoCameraOutlined>}>
            <Link to={'/goods'}> 商品管理</Link>
            
          </Menu.Item>
          <Menu.Item key={4} icon={<UploadOutlined></UploadOutlined>}>
            <Link to={'/order'}> 订单管理</Link>

          </Menu.Item>
        </Menu>
      </Sider>
  );
};